import 'package:flutter/material.dart';
import '../../manger/qysdk_manger.dart';
import '../../l10n/app_localizations.dart';

// Custom Overlay and Popup
class CustomOverlayView extends StatelessWidget {
  final VoidCallback onClose;

  CustomOverlayView({
    required this.onClose,
  });

  @override
  Widget build(BuildContext context) {
    return Material(
      color: Colors.transparent,
      child: Stack(
        children: [
          // Dimming overlay background
          GestureDetector(
            onTap: onClose,
            child: Container(
              color: Colors.black.withValues(alpha: 0.4),
            ),
          ),
          // The custom overlay content (popup window)
          Center(
            child: Material(
              color: Colors.transparent,
              child: Container(
                margin: EdgeInsets.symmetric(horizontal: 15),
                padding: EdgeInsets.all(20),
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.circular(12),
                  boxShadow: [
                    BoxShadow(
                      color: Colors.black.withValues(alpha: 0.2),
                      blurRadius: 10,
                      offset: Offset(0, 2),
                    ),
                  ],
                ),
                child: Stack(
                  children: [
                    // Close Button positioned at the top-right corner
                    Positioned(
                      right: 1,
                      top: 1,
                      child: GestureDetector(
                        onTap: onClose,
                        child: Icon(Icons.close, color: Colors.black),
                      ),
                    ),
                    // Content below the close button
                    Column(
                      mainAxisSize: MainAxisSize.min,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        SizedBox(height: 30), // Space for the close button
                        Text(
                          AppLocalizations.of(context)!.recharge1,
                          style: TextStyle(
                            fontWeight: FontWeight.bold,
                            fontSize: 16,
                          ),
                        ),
                        SizedBox(height: 10),
                        Text(
                          AppLocalizations.of(context)!.recharge2,
                          style: TextStyle(fontSize: 14),
                        ),
                        SizedBox(height: 10),
                        Text(
                          AppLocalizations.of(context)!.recharge3,
                          style: TextStyle(
                            fontWeight: FontWeight.bold,
                            fontSize: 16,
                          ),
                        ),
                        SizedBox(height: 10),
                        Text(
                          AppLocalizations.of(context)!.recharge4,
                          style: TextStyle(fontSize: 14),
                        ),
                        SizedBox(height: 10),
                        Text(
                          AppLocalizations.of(context)!.recharge5,
                          style: TextStyle(
                            fontWeight: FontWeight.bold,
                            fontSize: 16,
                          ),
                        ),
                        SizedBox(height: 10),
                        Text(
                          AppLocalizations.of(context)!.recharge6,
                          style: TextStyle(fontSize: 14),
                        ),
                        SizedBox(height: 20),
                        GestureDetector(
                          onTap: () {
                            onClose();
                            // Perform custom action (e.g., call delegate)
                          },
                          child: GestureDetector(
                            onTap: () {
                              QYSDK.showQYSession();
                            },
                            child: Text(
                              AppLocalizations.of(context)!.recharge7,
                              style: TextStyle(
                                color: Colors.blue,
                                fontSize: 14,
                                decoration: TextDecoration.underline,
                              ),
                            ),
                          ),
                        ),
                      ],
                    ),
                  ],
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}
